import React, { useEffect } from 'react';
import { connect } from 'umi';
import { Card, Row, Col, Empty } from 'antd';
import { history } from 'umi';
import { formatMessage } from 'umi';
// import BizIcon from '@/components/BizIcon';
// import getIconType from '@/pages/Flow/Mine/List/getIconType';

import styles from '@/pages/Flow/Mine/List/index.less';
import FlowIcon from '@/components/BizIcon/FlowIcon';
import authHelpr from '@/utils/auth/helper';

const { checkCode } = authHelpr;

const List = ({ mineList, dispatch }) => {
    const { list } = mineList;

    const toDetail = subItem => {
        history.push({
            pathname: '/personal/portal/flow/mine/list/apply',
            query: {
                templateId: subItem.templateId,
                processDeploymentId: subItem.processDeploymentId,
                formDeploymentId: subItem.formDeploymentId,
                templateName: subItem.templateName,
                id: ''
            }
        });
    };
    // const getCategoryName = code => {
    //     const find = categoryType.find(item => item.dictKey === code);

    //     if (find) {
    //         return find.dictName;
    //     }
    //     return '';
    // };
    useEffect(() => {
        dispatch({
            type: 'mineList/fetchCategoryType'
        });
        dispatch({
            type: 'mineList/fetchList',
            payload: {
                hasQuitHrAuth: checkCode('office:personnel:progress:leaveoffice:add')
            }
        });
    }, [dispatch]);
    // TODO 这里因为属于考勤部分，只显示考勤流程的内容
    return (
        <div className={styles.list}>
            {list && list.length > 0 ? (
                // list.map(item => (
                <Card
                    title={formatMessage({
                        id: 'stat.title.kqcylc'
                    })}
                    key={list[0].category}
                    bordered={false}
                >
                    <Row type="flex" align="middle">
                        {list[0].myApplyTemplateVOList.map(subItem => (
                            <Col
                                title={subItem.templateName}
                                key={subItem.templateId}
                                onClick={() => toDetail(subItem)}
                            >
                                <FlowIcon className={styles.icons} iconType={subItem.iconType} />
                                <span className={styles.templateName}>{subItem.templateName}</span>
                            </Col>
                        ))}
                    </Row>
                </Card>
            ) : (
                // ))
                <Card>
                    <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
                </Card>
            )}
        </div>
    );
};

export default connect(({ mineList }) => ({ mineList }))(List);
